pinEdit Integration
To integrate pinEdit in your application you only need one HTML tag.
pinEdit in a frame document
If you want to use a single pinEdit per frame then call
<frame id="frMain" name="frMain" src="pinEdit.html?url=test.html" marginwidth="0" marginheight="0">
Or use
<frame id="frMain" name="frMain" src="pinEditExtended.html ?url=test.html" marginwidth="0" marginheight="0">
(for extended mode)
pinEdit in a IFRAME
If you want to integrate (one or more) pinEdit within a document then use an IFRAME:
<IFRAME id="editorFrame" style="WIDTH: 100%; HEIGHT: 250px" src="/application/pinEdit.html?url=test.html&toolbar=0110">
Or with absolute positioning:
<IFRAME id="editorFrame" style="POSITION:absolute; TOP: 20px; LEFT: 30px;WIDTH: 300px; HEIGHT: 250px" src="/application/pinEdit.html?url=test.html&toolbar=0110">
You can also use it within a table like
<td><IFRAME id="editorFrame" src="/application/pinEdit.html?url=test.html&toolbar=0110"></td>
Submit formular with pinEdit content
To submit the HTML content of pinEdit with other form fields please look at the following sample:
<HTML>
<HEAD>
<script>
function transmit()
{
// read the HTML content of pinEdit
var html = document.getElementById("editorFrame").contentWindow.editGetHtml();
// add the content to the hidden field
document.frmMail.html.value = html;
// submit the formular
document.frmMail.submit();
}
</script>
</HEAD>
<BODY>
<form id="frmMail" name="frmMail" method="POST" action="YOURACTION">
<input type="hidden" value="" name="html">
…
<TR>
<TD colSpan=2><IFRAME id="editorFrame" style="WIDTH: 100%; HEIGHT: 300px" src="../application/pinEdit.html"></IFRAME></TD></TR>
<TR>
<TD><input type="button" value="Send Mail" onclick="transmit()" ></TD>
<TD></TD>
</TR>
</TABLE>
</form>
</BODY>
</HTML>